<template>
	<view class="content">
		<view class="mianBody">
			<p class="time">{{time}}</p>
			<itemFile v-for="(item,index) in listCard" :item='item' :key="index" color='#fff' :class="index==2?'cardtop':''">
				<view class="soltValue" v-if='index==2'>
					<u-line></u-line>
					<p class="total" style="font-weight: bold;">合计（净重）：<span>{{total}}</span>kg</p>
					<p class="total" style="color:#999999;">每个空桶重4.3kg</p>
					<view style="margin-top:28rpx" class="edict-button">
					</view>
					<u-line></u-line>
					<p class="total" style="color:#999999;text-align: left;">
						<span style="font-size: 30rpx;">交接人</span>
						<span style="font-size: 30rpx;color: black;margin-left: 40rpx;">{{jjr}}</span>
					</p>
				</view>
				<u-line v-if="index==1"></u-line>
			</itemFile>

		</view>
		<view class="fouter_card">
			<p class="title" style="font-weight: bold;"> 收运信息</p>

			<view class="carditem">
				<text class='title'>计划单号</text>
				<text class='value'>{{detail.planOrderNo || ''}}</text>
			</view>
			<view class="carditem">
				<text class='title'>接收时间</text>
				<text class='value'>{{detail.receivingTime || ''}}</text>
			</view>
			<view class="carditem">
				<text class='title'>车牌号</text>
				<text class='value'>{{detail.licensePlate || ''}}</text>
			</view>
			<view class="carditem">
				<text class='title'>驾驶员</text>
				<text class='value'>{{detail.driverName || ''}}</text>
			</view>
			<view class="carditem">
				<text class='title'>装卸员</text>
				<text class='value'>{{detail.loUnPerson || ''}}</text>
			</view>
			<view style="display: flex;align-items: center;gap:40rpx;line-height: 48rpx;">
				<view class="carditem">
					<text class='title'>复核重量</text>
					<text class='value'>{{detail.revisedWeight || ''}}kg</text>
				</view>
				<view class="carditem">
					<text class='title'>是否属实</text>
					<text class='value'>{{detail.truthfulness=="Y"?'是':'否'}}</text>
				</view>
			</view>
			<view class="carditem">
				<text class='title'>收运人签字</text>
				<text class='value'>{{detail.collectionTransportPerson || ''}}</text>
			</view>
			<view class="carditem">
				<text class='title'>异常备注</text>
				<text class='value'>{{detail.abnormalRemark?detail.abnormalRemark:''}}</text>
			</view>
			<view class="carditem">
				<text class='title'>收运记录单照片</text>
			</view>
			<view class="carditem" v-if="detail.collectionTransportPlanPic">
				<image :src="detail.collectionTransportPlanPic" mode="" style="width: 200rpx;
		height: 200rpx;
		border: 1rpx solid #f2f2f2;
		border-radius: 10rpx;"></image>
			</view>
		</view>
		<view class="fouter_card">
			<p class="title" style="font-weight: bold;font-size: 30rpx;">电子签章</p>
			<view style="margin-top: 20rpx;">
				<image :src="detail.signatures" mode="" style="width: 200rpx;
height: 200rpx;
border: 1rpx solid #f2f2f2;
border-radius: 10rpx;"></image>
			</view>
		</view>
		<view class="print" style="margin-bottom: 50rpx;" @click="Print">
			查看转移联单
		</view>
	</view>
</template>

<script>
	// 两种状态收运都用这个（）
	import {
		detailValue,
		invalid,
		getFileAuthPath
	} from '../../utils/api.js'
	export default {
		data() {
			return {
				time: '',
				jjr: '',
				showData: false,
				detail: {},
				total: '',
				listCard: [{
						title: '',
						id: '',
						cardId: '',
						child: [{
								width: '100%',
								title: '收运记录单号',
								mark: ''
							},
							{
								width: '100%',
								title: '客户简称',
								mark: ''
							},
							{
								width: '50%%',
								title: '客户地址',
								mark: ''
							},
						]
					}, {
						title: '感染性医疗废物（kg)(841-001-01)',
						child: [{
								width: '50%',
								title: '桶数',
								mark: ''
							},
							{
								width: '50%',
								title: '毛重',
								mark: ''
							},
							{
								width: '50%',
								title: '净重',
								mark: ''
							},
						]
					},
					{
						title: '损伤性医疗废物（kg)(841-002-01)',
						child: [{
								width: '50%',
								title: '桶数',
								mark: ''
							},
							{
								width: '50%',
								title: '毛重',
								mark: ''
							},
							{
								width: '50%',
								title: '净重',
								mark: ''
							},
						]
					}
				]
			}
		},
		onLoad(options) {
			this.cardId = options.id
			if (options.show == 'true') {
				this.showData = true
			} else {
				this.showData = false
			}

			detailValue({
				id: options.id
			}).then(res => {
				this.time = res.data.createTime
				this.listCard[0].title = res.data.mdcInstitutionName
				this.listCard[0].id = res.data.id
				this.listCard[0].child[0].mark = res.data.serialNo
				this.listCard[0].child[1].mark = res.data.mdcInstitutionShortName
				this.listCard[0].child[2].mark = res.data.mdcInstitutionAddress
				this.listCard[1].child[0].mark = res.data.infectionBarrelsCount
				this.listCard[1].child[1].mark = res.data.infectionGrossWeight
				this.listCard[1].child[2].mark = res.data.infectionNetWeight
				this.listCard[2].child[0].mark = res.data.sharpsBarrelsCount
				this.listCard[2].child[1].mark = res.data.sharpsGrossWeight
				this.listCard[2].child[2].mark = res.data.sharpsNetWeight
				this.jjr = res.data.transferPerson
				this.total = res.data.totalWasteNetWeight
				this.detail = res.data
				if (this.detail.signatures) this.getImgPath('signatures', this.detail.signatures)
				if (this.detail.collectionTransportPlanPic) this.getImgPath('collectionTransportPlanPic', this.detail
					.collectionTransportPlanPic)
			}).catch(err => {
				uni.$u.toast('获取详情信息失败!')
			})
		},
		methods: {
			// 获取图片
			getImgPath(type, ids) {
				getFileAuthPath({
					fileIds: ids
				}).then(res => {
					console.log('图片地址：', res)
					if (type == 'signatures') {
						this.detail.signatures = res.data[0].path
					} else {
						this.detail.collectionTransportPlanPic = res.data[0].path
					}
				})
			},
			Print() {},
			edict(item) {
				uni.navigateTo({
					url: `/pages/Receivingedict/Receivingedict?id=${this.cardId}&edict=true`
				})
			},
			remove() {
				let self = this
				uni.showModal({
					title: '提示',
					content: '确定作废当前数据？',
					success: function(res) {
						if (res.confirm) {
							invalid({
								id: this.cardId
							}).then(res => {
								self.logList()
								uni.$u.toast('作废成功!')
							}).catch(err => {
								uni.$u.toast('作废失败!')
							})
							// 用户点击了确定，执行相应的逻辑
						}
					}
				});
			},

		}
	}
</script>

<style scoped lang="less">
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;

	}

	.edict-button {
		display: flex;
		justify-content: flex-end;
		gap: 20rpx
	}

	.head {
		width: 750rpx;
		height: 276rpx;
		position: fixed;
		top: 0;
		z-index: 1;
		background: url(@/static/sy.png) no-repeat;
		background-size: contain;
	}

	/deep/ .filecard {
		padding-left: 0rpx !important;
	}

	.soltValue {
		text-align: right;

		.total {
			font-size: 26rpx;
			font-family: PingFang SC, PingFang SC-Semibold;
			font-weight: Semibold;
			text-align: right;
			color: #333333;
			padding: 20rpx 0;

			span {
				font-size: 40rpx;
			}
		}

	}

	.cardtop {
		position: relative;
		top: -20rpx;

	}

	.fouter {
		display: flex;
		gap: 20rpx;
		justify-content: center;
		margin-bottom: 40rpx;
		padding: 0 20rpx;
		box-sizing: border-box;
	}

	.time {
		font-size: 26rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: Regular;
		text-align: right;
		color: #999999;
		position: absolute;
		top: 30rpx;
		right: 20rpx;
	}

	.fouter_card {
		width: 750rpx;
		background: #FFFFFF;
		box-sizing: border-box;
		padding: 30rpx 20rpx;
		margin-bottom: 20rpx;
	}

	.title {
		font-size: 34rpx;
		font-family: PingFang SC, PingFang SC-Semibold;
		font-weight: Semibold;
		text-align: left;
		color: #333333;
		line-height: 48rpx;
		display: flex;

	}

	.carditem {
		display: flex;
		font-size: 28rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: Regular;
		text-align: left;
		margin-top: 20rpx;
		align-items: center;

		.title {
			font-size: 30rpx !important;
			margin-right: 30rpx;
			color: #999999;
		}

		.value {
			color: black;
		}

	}

	.print {
		width: 690rpx;
		height: 100rpx;
		margin: 30rpx auto;
		background: #3db020;
		border-radius: 10rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 34rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: Regular;
		text-align: center;
		color: #ffffff;

	}
</style>